<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src=".././static/js/public-head.js"></script>
</head>
<body>

<form class="layui-form" action="javascript:;">
    <div class="layui-form-item">
        <div class="layui-collapse">
            <div class="layui-colla-item">
                <h2 class="layui-colla-title"></h2>
                <div class="layui-colla-content layui-show">
                    <div class="layui-inline">
                        <div class="layui-input-inline">
                            <input  type="text"   name="searchStr" placeholder="输入关键字" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <!--<div class="layui-inline">-->
                        <!--<button class="layui-btn" lay-submit="" lay-filter="query">查询</button>-->
                    <!--</div>-->


                </div>
            </div>
        </div>
    </div>
</form>

<table class="layui-hide" id="xdWidget-tb" lay-filter="xdWidget-tb"></table>

<script type="text/javascript">
    var layindex,layevent;
    layui.config({
        base: basePath+'/layui/lay/modules/'
    }).extend({
        formSelects: 'formSelects-v4'
    }).use([ 'table','form','formSelects' ,'element','laydate'], function() {
        var $ = layui.$;
        var form = layui.form;
        var formSelects = layui.formSelects;
        var layer = layui.layer;
        var table = layui.table;
        var element = layui.element
        var laydate= layui.laydate;


        var tableOption = {
            elem: '#xdWidget-tb'
            ,url: basePath + '/xdWidget/query'
            ,where:{searchStr:function(){return $("input[name='searchStr']").val()}}
            ,method:"post"
            ,toolbar:false
            ,title:"系统参数配置"
            ,defaultToolbar:['filter', 'print']
            //,width: 600
            ,cols: [[
                {title: '请选择', width:80,type:"radio",fixed:'left'}
                ,{field:'name', title: '名称',fixed:'left',sort:true , width:180}
                ,{field:'classFlag', title: 'CSS类标识',fixed:'left',width:180,sort:true  }
                ,{field:'dateCreated', title: '新增时间',hide:true ,sort:true }
                ,{field:'lastUpdated', title: '更新时间',hide:true ,sort:true }
                ,{field:'creator', title: '创建人',hide:true }
                ,{field:'updater', title: '更新人',hide:true }
            ]]
            ,page: true
            ,height: 'full-120'

        }


        var tableDom = commonUtil.renderTableOPT(table,tableOption)
        var objId ;
        table.on("toolbar(xdWidget-tb)",function(obj) {

            var checkStatus = table.checkStatus(obj.config.id);
            var titleLabel = ""
            if("delete-edit-detail-copy".indexOf(obj.event)!=-1 && checkStatus.data.length ==0){
                layer.msg("请选中后再操作")
                return
            }
            if( checkStatus.data.length !=0){
                objId =  checkStatus.data[0].id || "";
            }else{
                objId =  "";
            }
            switch(obj.event){
                case 'edit':
                    titleLabel = "编辑"
                    layindex =   layer.open({
                        type:1,
                        title:"<ii class='layui-icon layui-icon-note'> "+titleLabel+"</ii>",
                        content: $("#xdWidget-update-dom").html(),
                        area: ['700px', '500px'],
                        cancel : function(){
                            table.reload("xdWidget-tb")
                        },
                        success :function(layero, index){
                            $.getJSON(basePath+"/xdWidget/getOne",{id:objId},function(rst){
                                if(rst.code ==0){
                                    form.val("xdWidget-form",rst.data)
                                    //html-view
                                    $("#xdWidget-form").find("#html-view").html(rst.data.html)
                                    formSelects.render()
                                    form.render('checkbox');
                                    form.render('radio');
                                    laydate.render({elem:".xd-date"})
                                }
                            })
                        }
                    })
                    break;
                case 'detail':break;
                case 'del':
                    var id = objId
                    var param = {id:objId}
                    layer.confirm('确定要删除改记录吗？', {icon:0, title:'提示'}, function(index){
                        $.getJSON(basePath+"/xdWidget/delete",param,function(res){
                            if(res.code !=0){
                                layer.msg(res.msg)
                            }else{
                                table.reload("xdWidget-tb")
                                layer.close(index)
                                return true;
                            }
                        } )
                    });
                    break;
                case 'add':
                    titleLabel = "新增"
                    layindex =   layer.open({
                        type:1,
                        title:"<ii class='layui-icon layui-icon-note'> "+titleLabel+"</ii>",
                        content: $("#xdWidget-update-dom").html(),
                        area: ['700px', '500px'],
                        cancel : function(){
                            table.reload("xdWidget-tb")
                        }
                    })
                    break;
                case 'query':
                    table.reload("xdWidget-tb")
                    break;
            }
        })

        form.on("submit(xdWidget-form-bt)",function(obj){
            var url = basePath+"/xdWidget/add"
            if(objId != null && objId != ""){
                url = basePath+"/xdWidget/update"
            }
            var param = commonUtil.getFormValueNormal("#xdWidget-form")
            param.id = objId
            $.post(url,param,function(rst){
                if(rst.code == 0){
                    //layer.close(layindex)
                    $("#xdWidget-form").find("#html-view").html(rst.data.html)
                    //form.render("select")
                    objId = rst.data.id
                    formSelects.render()
                    form.render('checkbox');
                    form.render('radio');
                    laydate.render({elem:'.xd-date'})
                }
                layer.msg(rst.msg)
            },"json")
            return false
        })

    });

</script>
</body>

<script type="text/html" id="xdWidget-update-dom">
    <div class="layui-card"  >
        <div class="layui-card-body"  >
            <form class="layui-form layui-form-pane" action="" lay-filter="xdWidget-form" id="xdWidget-form">
                <div class="layui-form-item">
                    <label class="layui-form-label">Widget名称</label>
                    <div class="layui-input-inline">
                        <input type="text" name="name"  lay-verify="required" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">CSS类标识</label>
                    <div class="layui-input-inline">
                        <input type="text" name="classFlag"  lay-verify="required" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">HTML</label>
                    <div class="layui-input-block">
                            <textarea type="text" name="html" placeholder="只能新增单个表单元素，且不能有验证！" style="height: 200px"
                                      lay-verify="required" autocomplete="off"
                                      class="layui-textarea"><input type="text" name="" id="" class="xd-input layui-input" autocomplete="off" ></textarea>
                    </div>
                </div>
                <div class="layui-form-item" >
                    <label class="layui-form-label">预览</label>
                    <div class="layui-input-block" id="html-view">

                    </div>
                </div>
                <div class="layui-form-item layui-layout-admin">
                    <div class="layui-input-block">
                        <div class="layui-footer" style="left: 0;">
                            <button class="layui-btn" lay-submit="" lay-filter="xdWidget-form-bt">保存</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</script>
</html>